<template>
  <view class="content">
    <ProductSearch @search="search" :has-scan="false"></ProductSearch>

    <view class="list">
      <view class="card" v-for="(item, i) in tagPrintList" :key="i">
        <view @click="tagPrintDetail(item)">
          <view class="datatitle">{{ item.id }}</view>
        </view>
      </view>
    </view>
    <el-button class="fixedBtn" type="primary" round @click="addBtn">+ {{$t(`global.record`)}}</el-button>
  </view>
</template>

<script lang="ts" setup>
import * as tagPrintApi from '@/service/api/hkb/tagPrint/index'
import { Navigate } from '@/utils';
import Storage from "@/modal/useStorage";
import ProductSearch from '../components/productSearch.vue'
import { formatDate } from '@/utils/formatTime'
import i18n from '@/main'
onReady(() => {
  uni.setNavigationBarTitle({
    title: i18n.global.locale === 'zh' ? '标签打印' : 'TAGPRINT'
  });
})
const tagPrintList = ref()
const queryParams = ref<any>({
  pageNo: 1,
  pageSize: 10000,
  automaticNumber: ''
})
const tagPrintDetail = (item: any) => {
  Storage.set('tagPrintDetail', { tagPrint: item, isAdd: false, isEdit: false })
  Navigate.to('/pages/hkb/tagPrint/detail')
}
const search = async (val?: string) => {
  queryParams.value.automaticNumber = val
  const res = await tagPrintApi.getList(queryParams.value)
  tagPrintList.value = res.list
}
const addBtn = () => {
  Storage.set('tagPrintDetail', { tagPrint: null, isAdd: true, isEdit: false })
  Navigate.to('/pages/hkb/tagPrint/detail')
}
onLoad(() => {
  search()
})
</script>

<style scoped lang="scss">
.list {
  padding: 0 20rpx;

  .card {
    padding: 20rpx;
    background: #fff;
    margin-bottom: 20rpx;
    border-radius: 6rpx;
    box-shadow: 0 2rpx 4rpx #bbb;
  }

  .datatitle {
    font-size: 25rpx;
    font-weight: 600;
  }

  .image {
    width: 100rpx;
    height: 100rpx;
  }

  .label {
    font-size: 25rpx;
    color: #9e9e9e;
    margin: 15rpx 0;
  }

  .tagbox {
    display: inline-flex;

    .tag {
      margin-right: 10rpx;
    }
  }

  .text {
    font-size: 24rpx;
  }
}</style>